(function (window, angular) {
    'use strict';
    //1. 分析整体界面
    //2. 编写angular代码
    //3. 引用angularjs文件
    //4. 创建模块和控制器
    //5. 写angular的业务逻辑代码
    //6.完成主体（增删改查 Ceate Read Updata Delete）功能
    //7. 完成子功能（全选切换，未完成数量统计，数据的过滤，删除已完成的数据）
    var app = angular.module('todoApp', ['todoApp.directive', 'todoApp.service']);
    app.controller('todoCtrl', function ($scope, $filter, storageService) {
        /*查、增、删、改*/

        //查
        //将两者索引关联,则数据变化两个对象引用指向的对象也会跟着变化
        //但:我们这只是模拟,本地数据会跟着$scope里的数据变化,正常情况下修改数据还是在后台(相当于服务)里做
        $scope.todoList = storageService.getTodo();
        console.log($scope.todoList);
        //增加
        //用表单form的ng-submit
        $scope.add = function () {
            storageService.addTodo($scope.text);
            //清空输入框
            $scope.text = "";
        }

        //删除
        //删除索引对应的值
        $scope.del = function (item) {
            storageService.delTodo(item);
        }

        //改
        //双击对应的可以进行编辑
        $scope.edit = function (item) {
            //双击的时候将所点击的li的id赋给一个变量,然后angular遍历html进行渲染时,第一个li的id刚好等于这个
            //全局变量,而第二个的id就不等于这个全局变量,就不会添加editing这个样式
            $scope.editingID = item.id;
        }
        //编辑完之后失焦回到原点
        $scope.edited = function (item) {
            $scope.editingID = -1;
            //如果没有文字了调用上面的删除方法,删掉这一行
            if (item.text.length == 0) {
                $scope.del(item);
            }else{
                //否则就调用服务的方法修改数据
                storageService.editTodo(item.text);
            }
        }

        //点击checkbox其实也算修改了数据
        $scope.checkClick= function () {
            storageService.checkChangeTodo();
        }

        /*子功能*/
        // 未完成数量统计,只要有数据变化,里面的回调函数就会执行
        $scope.$watch('todoList', function (newValue, oldValue) {
            $scope.todoCount = $filter('filter')(newValue, {isCompleted: false}).length;
            //如果当前数据没有被选中的checkbox就隐藏,否则就显示
            $scope.isCompletedShow = $filter('filter')(newValue, {isCompleted: true}).length <= 0 ? false : true;
            //数据都米有的时候大家就都隐藏
            $scope.isAllShow = newValue.length > 0 ? true : false;
            //console.log($scope.isAllShow);
            //全选按钮: 根据todoCount,如果当前有0个说明都被选中了剩0个,则全选按钮选中,反之同理
            $scope.allToggle = !$scope.todoCount;
        }, true);

        // 删除已完成的数据
        $scope.todoClearCompleted = function () {
            /*//重新给todoList这个数组赋值,即未完成的
            $scope.todoList = $filter('filter')($scope.todoList, {isCompleted: false});
            //如果数据在后台,在前台修改了作用域中的数据并不会影响后台的数据,因需要在后台操作*/
            //重新建立联系
            $scope.todoList=storageService.clearCompletedTodo();
        }
        //切换状态,同时改变样式(红色的那个边框)
        //定义过滤器的初始值为空对象,这样相当于不过滤
        $scope.todoFilter = {};
        $scope.todoChangeFilter = function (num) {
            switch (num) {
                case 1:
                    $scope.todoFilter = {isCompleted: false};
                    //switch中的case记得都要break!!
                    break;
                case 2:
                    $scope.todoFilter = {isCompleted: true};
                    break;
                default:
                    //其他参数就变成默认的,不筛选
                    $scope.todoFilter = {};
            }
        }

        //全选事件
        $scope.todoAllChoose = function () {
            //巧方法,但不容易想到:由于全选按钮其实质是一个checkbox,借助$scope.todoCount,在监听器里
            storageService.chooseAllTodo($scope.allToggle)
        }

    })
})(window, angular);
